<!DOCTYPE html>
<html>
<head>
    <title>html 5 basics</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <style>
        input[type="search"] {
            -webkit-appearance: textfield;
        }
    </style>
</head>

<body>
<section> section1</section>
<section> section2</section>
<section> section3</section>

<form id="login1" action="account/login1" method="get">

</form>

<input type="text" placeholder="input your name here" name="account" value=""
       list="lst-options" required
       form="login1" autofocus/>
<input type="password" name="passpord" value="123" form="login1"/>
<input type="submit" value="login" form="login1"/>

<!--<input type="submit" value="enter in" form="login1" formaction="account/one" formmethod="post" />-->

<br/>

<datalist id="lst-options">
    <option>this is one</option>
    <option>this is two</option>
    <option>this is three</option>
</datalist>


<header>form elements</header>

<!--<input type="text" value="" placeholder="input sth..." />-->
<input type="search" value="" placeholder="input sth to search..."/> <br/>


<input type="tel" name="tel" placeholder="tel..." pattern="^\d{1,}$" form="login1" title="10 digital required"/>

<input type="url" name="site" placeholder="url required..." form="login1"/>


<input type="email" name="umail" placeholder="email" required form="login1"/>

<br/>
date:
<input name="test1" type="date" form="login1"/> <br/>
datetime:
<input name="test1" type="datetime" form="login1"/><br/>
datetime-local
<input name="test1" type="datetime-local" form="login1"/><br/>
time:
<input name="test1" type="time" form="login1"/><br/>

moth:
<input name="test1" type="month" value="2014-10" form="login1"/><br/>
week:
<input name="test1" type="week" form="2014-W10"/><br/>


</body>

<script>
    window.onload = function () {
        setTimeout(function () {
            // alert("window loaded!!!!!");


        }, 500);
    }
</script>


</html>